/*
 * Created: 2020-03-09 10:09:27
 * Author : Mockingbird
 * Email : 1768385508@qq.com
 * -----
 * Description: route
 */
import * as React from 'react';
import Loadable from 'react-loadable';
import BaseLayout from './layouts/Base';
import Login from './containers/Login';
import { Spin } from 'antd';
import { LoadingOutlined } from '@ant-design/icons';
import NotFound from '@components/NotFound';

function Loading() {
  const antIcon = <LoadingOutlined style={{ fontSize: 34 }} spin />
  return (
    <div
      style = {{
        width: '100vw',
        height: '100vh',
        position: 'absolute',
        overflow: 'hidden',
        left: 0,
        top: 0
      }}
    >
      <div style={{
        width: '50px',
        height: '50px',
        position: 'absolute',
        left: '50%',
        top: '50%',
        margin: '-25px 0 0 -25px'
      }}>
        <Spin indicator={antIcon} />
      </div>
    </div>
  );
}

const Console = Loadable({
  loader: () => import(/* webpackChunkName: "console" */ '@pages/console/App'),
  loading: Loading,
});
export default [
  { path: `/login`, component: Login, exact: true },
  { path: '/404', component: NotFound, exact: true },
  {
    component: BaseLayout,
    routes: [
      {
        path: '*',
        component: Console,
      },
    ],
  },
];
